import { Component ,createRef} from "react"
// 导入上下文对象
import myctx from "../myContext"
import Cp3 from "./cp3"
class Cp2 extends Component {

    iptRef = createRef(null);

    confirmName = ()=>{
        const value = this.iptRef.current.value;
        this.context.setUserInfo({
            name:value
        })
    }

    render(){
        return (
            <div>
                我是cp2组件
                <div> 
                    context in the cp2: 
                    { JSON.stringify(this.context) }
                 </div>
                  <input placeholder="输入名字" ref={this.iptRef} />
                  <button onClick={this.confirmName}>确认修改</button>
                 <hr />

                 <Cp3 />
            </div>
        )
    }
}

// 给当前的类组件设置 一个静态属性contextType 等于上下文对象
// 那么类组件内部就可以通过 this.context 访问 上下文对象供应的值
Cp2.contextType = myctx

export default Cp2